import React, { Component } from 'react'

export default class App extends Component {

    state = {
        count: 100
    }

    render() {
        return (
            <div>
                <h1>{this.state.count}</h1>
                <button onClick={function () {
                    //直接在这里写 function ,普通函数会导致 this 是一个undefined
                    //点击事件中不能直接使用普通函数
                    console.log('被点击了', this);
                }}>增加</button>

                {/* 
                    i++ 先用再加
                    ++i 先加再用
                */}

                <button onClick={() => {
                    //行内写的时候,可以使用箭头函数的方式进行使用------------------推荐
                    console.log('被点击了', this);

                    //这样使用是不规范的,相当于直接操作了源数据

                    // this.setState({
                    //     count:this.state.count++
                    // })

                    // this.setState({
                    //     count:++this.state.count
                    // })

                    this.setState({
                        count: this.state.count + 1
                    })
                }}>点击增加</button>
            </div>
        )
    }
}
